<template>
  <div class="ADhome">
    <el-container class="home-container">
      <el-header class="home-header">
        <el-row>
          <el-col :span="23">
            <div class="grid-content bg-purple-light">二手手机后台管理</div>
          </el-col>
          <el-col :span="1">
            <a class="grid-content active" @click="exit()">
            <span>退出</span>
            </a>
          </el-col>
        </el-row>
      </el-header>
      <el-container>
        <el-aside width="240px" class="home-aside">
         <!-- 开启路由模式 -->
          <el-menu
            :default-active="activeNAv"
            class="el-menu-vertical-demo"
            :router="true"
            :unique-opened="true"
          >
            <el-menu-item index="ADmessage">
                <i class="el-icon-user"></i>
                <span slot="title">账号管理</span>
            </el-menu-item>
            <el-menu-item index="ADslideshow">
                <i class="el-icon-picture-outline"></i>
                <span slot="title">轮播图管理</span>
            </el-menu-item>
            <el-menu-item index="ADnotice">
                <i class="el-icon-s-order"></i>
                <span slot="title">公告管理</span>
            </el-menu-item>
            <el-menu-item index="ADselect">
                <i class="el-icon-date"></i>
                <span slot="title">发布管理</span>
            </el-menu-item>
          </el-menu>
        </el-aside>
        <el-main class="home-main">
          <keep-alive>
            <router-view></router-view>
          </keep-alive>
        </el-main>
      </el-container>
    </el-container>
  </div>
</template>

<script>
export default {
  name: 'ADhome',
  data () {
    return {
      activeNAv: 'student'
    }
  },
  components: {},
  mounted () {
    var _this = this
    var href = window.location.href
    href = href.split('/#/')[1]
    _this.activeNAv = href
  },
  methods: {
    // 退出
    exit () {
      this.$confirm('确定退出?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(async () => {
       const res = await this.$http.get('user/logout')
        console.log(res)
        if (res.data.status === 200) {
        this.$message.success('退出成功！')
        this.$router.push({name: 'login',params:{user: false}})
        }else {
          this.$http.warning(res.data.msg)
        }
      }).catch(() => {
        // this.$message({
        //   type: 'info',
        //   message: '已取消退出'
        // })
      })
    }
  },
  beforeCreate () {
  // 获取token
    const token = sessionStorage.getItem('adtoken')
    // console.log(token)
    if (!token) {
      // token没有则->登录
      this.$router.push({name: 'login',params:{user: false}})
    }
    // if token存在->继续渲染
  }
}
</script>

<style lang="stylus">
.ADhome,.home-container
  height 100%
.home-header
  border-bottom #bbb solid 1px
  overflow hidden
  background-color #fff
  color #666
  letter-spacing 5px
.home-aside
  background-color #fff
  border-right #eee solid 1px
.home-main
  background-color #f2f2f2
  padding-bottom 0
  overflow-y hidden
.grid-content
  line-height 60px
  color #666
.bg-purple
  font-size 18px
.bg-purple-light
  text-align center
  font-size 26px
  font-weight 500
.active
  cursor pointer
.el-drawer
  overflow auto
</style>

